<template>
  <div class="enterprise-status-change">
    <div class="title-wrap">
      <RouteHeadLine />
      <div class="search-wrap">
        <el-form ref="formRef" :model="params" label-width="auto">
          <el-row :gutter="50" style="margin-top: 30px">
            <el-col :span="7">
              <el-form-item label="行政区划：">
                <el-tree-select
                  v-model="params.district"
                  :data="adminAreaList"
                  clearable
                />
              </el-form-item>
            </el-col>
            <el-col :span="7">
              <el-form-item label="企业名称：">
                <el-input v-model="params.customername" clearable></el-input>
              </el-form-item>
            </el-col>
            <!-- <el-col :span="6"
              ><el-form-item label="申请时间：">
                <el-date-picker
                  v-model="params.q"
                  type="date"
                  clearable
                  placeholder="请选择"
                  format="YYYY-MM-DD"
                  value-format="YYYY-MM-DD"
                /> </el-form-item
            ></el-col> -->
          </el-row>

          <el-row :gutter="50">
            <el-col :span="7"
              ><el-form-item label="审核状态：">
                <el-select
                  v-model="params.permitstatus"
                  clearable
                  placeholder="请选择"
                >
                  <el-option
                    v-for="item in permitstatusList"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  />
                </el-select> </el-form-item
            ></el-col>
            <el-col :span="7"
              ><el-form-item label="申请状态：">
                <el-select
                  v-model="params.applystatus"
                  clearable
                  placeholder="请选择"
                >
                  <el-option
                    v-for="item in applystatusList"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  />
                </el-select> </el-form-item
            ></el-col>

            <el-col :span="6">
              <el-button type="primary" @click="getList"
                ><el-icon style="color: #fff; margin-right: 5px"
                  ><Search /></el-icon
                >查询</el-button
              >
              <!-- <el-button
                type="danger"
                style="margin-left: 24px"
                :icon="ArrowLeft"
                @click="handleDelete"
                ><el-icon style="color: #fff; margin-right: 5px"
                  ><Delete /></el-icon
                >删除</el-button
              > -->
            </el-col>
          </el-row>
        </el-form>
      </div>
    </div>
    <div class="data-wrap">
      <el-table
        :data="tableData"
        border
        class="table-height"
        style="width: 100%"
      >
        <el-table-column align="center" type="selection" width="60" />

        <el-table-column prop="customername" align="center" label="企业名称" />
        <el-table-column
          prop="hbperson"
          align="center"
          label="联系人"
          width="120"
        />
        <el-table-column
          prop="hbmobile"
          align="center"
          label="联系方式"
          width="190"
        />
        <el-table-column
          prop="customeraddress"
          align="center"
          label="企业地址"
        />
        <el-table-column
          prop="applystatus"
          align="center"
          label="申请状态"
          width="130"
        >
          <template #default="{ row }">
            <div>
              {{ row.applystatus === 1 ? "正常" : "停业" }}
            </div>
          </template>
        </el-table-column>
        <el-table-column
          prop="permitstatus"
          align="center"
          label="审核状态"
          width="130"
        >
          <template #default="{ row }">
            <div style="color: #0874fa">
              <!-- 未审核//#0874FA #fa0808-->
              {{
                row.permitstatus === 0
                  ? "未审核"
                  : row.permitstatus == 1
                  ? "通过"
                  : "不通过"
              }}
            </div>
          </template>
        </el-table-column>

        <el-table-column prop="address" align="center" label="操作" width="150">
          <!-- b #CEE3FE    c  #0874FA   审核-->
          <template #default="{ row }">
            <button
              @click="handleAudit(row.id)"
              style="
                width: auto;
                padding: 8px 12px 10px 12px;
                background: #fee6ce;
                color: #fa6908;
              "
            >
              审核
            </button>
          </template>
        </el-table-column>
      </el-table>
      <div style="padding-right: 60px; margin-top: 25px">
        <Pagination
          v-model:currentPage="params.page"
          :total="total"
          v-model:page-size="params.pagesize"
          @getDataList="getList"
        />
      </div>
    </div>
    <Dialog
      diaWidth="40"
      diaTop="15"
      v-model:showDialog="showDialog"
      headerName="审核"
      @save="diaSave"
    >
      <template #content>
        <div class="content">
          <el-form :model="form" label-width="165px" label-position="right">
            <el-form-item label="审核状态：">
              <el-select
                v-model="form.permitstatus"
                clearable
                placeholder="请选择"
              >
                <el-option
                  class="dia-select-item"
                  v-for="item in permitstatusList"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                />
              </el-select>
            </el-form-item>
            <el-form-item label="备注：">
              <el-input
                clearable
                v-model="form.permitremark"
                :rows="6"
                type="textarea"
                placeholder="请输入"
              />
            </el-form-item>
          </el-form>
        </div>
      </template>
    </Dialog>
  </div>
</template>
<script setup lang="ts">
import Pagination from "@/components/Pagination.vue";
import RouteHeadLine from "@/components/RouteHeadLine.vue";
import http from "@http";
import changeArea from "@/utils/changeArea";
import ElMessage from "@/components/ElMessage.js";
import Dialog from "@/components/Dialog.vue";
let params = reactive({});
let handleSearch = () => {};
let total = ref(11);
let adminAreaList = ref([]);
let showDialog = ref(false);
let form = reactive({});
let ids = ref("");
let permitstatusList = ref([
  {
    label: "未审核",
    value: 0,
  },
  {
    label: "审核通过",
    value: 1,
  },
  {
    label: "审核不通过",
    value: 2,
  },
]);
http({ url: "/listitem/getmodule", data: { module: "B12" } }).then((res) => {
  if (res.code == 0) {
    permitstatusList.value = res.data.map((item) => {
      return { label: item.name, value: item.id };
    });
  }
});
let options = ref([
  { label: "佛挡杀", value: 2 },
  { label: "佛挡杀", value: 2 },
]);
let handleAudit = (id) => {
  ids.value = id;
  showDialog.value = true;
};
let applystatusList = ref([
  {
    label: "正常",
    value: 1,
  },
  { label: "停业", value: 2 },
]);
let diaBack = () => {
  showDialog.value = false;
};
let diaSave = () => {
  http({
    url: "/admPCEnterpriseStatus/doPermitEnterpriseStatus",
    data: { ...form, id: ids.value },
  }).then((res) => {
    if (res.code == 0) {
      showDialog.value = false;
      getList();
    }
  });
};
let tableData = ref([]);
let handleDelete = () => {};
http({ url: "/region/datalisttree" }).then((res) => {
  console.log(res, "res");
  if (res.code == 0) {
    adminAreaList.value = changeArea(res.data);
  }
});
let getList = () => {
  http({ url: "/admPCEnterpriseStatus/datalist", data: params }).then((res) => {
    if (res.code == 0) {
      tableData.value = res.data.list;

      total.value = res.data.total;
      ElMessage({ msg: "查询成功" });
    }
  });
};
getList();
</script>
<style lang="scss" scoped>
.enterprise-status-change {
  width: 100%;
  height: 100%;
  padding-left: 8px;
  overflow: hidden;
  .title-wrap {
    height: 192px;
    background: #ffffff;
    padding-top: 20px;
    :deep(.el-input.el-input--suffix) {
      width: 300px;
    }
    :deep(.el-input) {
      width: 300px;
    }
    /* width: 100%; */
    .search-wrap {
      padding-left: 35px;
      padding-right: 43px;
    }
  }
  .content {
    padding-top: 20px;
    padding-left: 20px;
    padding-right: 20px;
  }
  .data-wrap {
    margin-top: 10px;
    width: 100%;
    height: calc(100vh - 80px - 10px - 192px);
    background: #fff;
    padding: 10px 8px 0 8px;
    .table-height {
      max-height: calc(100vh - 41.1vh);
      overflow-y: scroll;

      button {
        width: 115px;
        height: 39px;
        background: #e5efff;
        border-radius: 5px;
        font-family: Source Han Sans CN;
        font-weight: 400;
        font-size: 20px;
        color: #0874fa;
      }
    }
  }
}
</style>
